<template lang="pug">
  div.table-empty
    s-table(
      ref="table"
      v-loading="roleLoading"
      :reqUrl="roleObj.url"
      reqMethod="GET"
      :column="roleObj.column"
      :filterProps="{fields: roleObj.filterItems, showBtns: false}"
    )
      .table-operator(slot="table-operator")
        el-button.gradientVertical(size="large" round @click="actionHandle({}, 'add')") 新增
      template(slot="action" slot-scope="text, scope")
        el-link(@click="actionHandle(scope, 'edit')" type="success") 修改
        el-popconfirm(
        title="您确认要删除该项?"
        @confirm="() => actionHandle(scope, 'delete')"
        @onConfirm="() => actionHandle(scope, 'delete')"
        )
          el-link(slot="reference" type="danger") 删除
</template>
<script>
import { api } from './api'
import { seachConfig, columnConfig } from './config'
import { getRoleTypes,ssoCodeVerify } from '@/api/common'

export default {
  data () {
    return {
      roleObj: {
        url: api.roleList,
        column: columnConfig,
        filterItems: seachConfig
      },

      roleLoading: false
    }
  },
  created () {
  },
  methods: {
    refreshTable (flag = false) {
      this.$refs.table.refresh(flag)
    },

    actionHandle (row, type) {
      this.$prompt('', '授权码验证', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputPlaceholder:'请输入授权码',
        inputValidator: (value) => {
          // 检查是否为空
          if (!value || value.trim() === '') {
            return '请输入授权码';
          }
          // 检查是否仅包含数字
          if (!/^\d+$/.test(value.trim())) {
            return '授权码只能输入数字';
          }
          return null;
        },
        beforeClose: (action, instance, done) => {
            if (action === 'confirm') {
              instance.confirmButtonLoading = true;
             ssoCodeVerify({
               code:instance.inputValue
             }).then(res => {
               instance.confirmButtonLoading = false;
               if(res==0){
                  this.$message.error('验证失败')
               }else{
                 this.$message.success('验证成功')
                 done();

               }
             }).catch(() => {
                  instance.confirmButtonLoading = false;
                  return false; // 阻止关闭
                });
            } else {
              instance.confirmButtonLoading = false;
              done(); // 取消操作直接关闭
            }
          }
      }).then(({ value }) => {
          setTimeout(()=>{
            if (type === 'delete') {
              // 删除
              this.deleteRole(row.roleId)
              return
            }
            if (type === 'add') {
              this.editRole('', {})
              return
            }
            if (type === 'edit') {
              this.editRole(row.roleName, { id: row.roleId })
              return
            }
          },500)
      })


    },

    deleteRole (id) {
      getRoleTypes({ id }, 'delete').then(res => {
        console.log(res)
        this.refreshTable()
      })
    },

    editRole (inputValue, params) {
      this.$prompt('请输入角色名称', '添加角色', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputValue: inputValue
      }).then(({ value }) => {
        if (value) {
          getRoleTypes({ roleName: value, ...params }, 'post').then(res => {
            console.log(res)
            this.$message.success('提交成功')
            this.refreshTable()
          })
        }
      })
    }
  }
}
</script>
<style lang="scss">
  .el-table--striped .el-table__body tr.el-table__row--striped.current-row td, .el-table__body tr.current-row>td {
    color: #fff;
    background-color: #F5AC3C!important;
  }
</style>
